/* 对话框 */

// 对话框背景
.dialog-background {
    background-image: var(--custom-background-image-dialog);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: fixed;
    background-color: transparent;
}

// 搜索结果列表项
.search-list-item() {
    padding-bottom: calc(1.25em + 1px);

    .b3-list-item__text {
        display: var(--custom-search-display);
    }

    .b3-list-item__meta.b3-list-item__meta--ellipsis {
        position: absolute;
        right: 4px;
        bottom: 0.25em;
        max-width: calc(100% - 12px);
        line-height: 1.25em;
    }
}

// 快捷键设置列表
#keymapList {
    .b3-list {

        .b3-list-item {

            // 可展开的项
            &.toggle {
                &:nth-last-child(2) {
                    /* 最后一项可展开的项 */
                    margin-bottom: 0 !important;
                }
            }
        }

        // 列表项容器
        .b3-list__panel {
            margin-top: 4px;

            // 辅助线
            &::before {
                border-left: var(--custom-list-guides-line-width) solid var(--custom-list-guides-line-color);
            }
        }
    }
}

.b3-dialog__container {
    // 对话框图片
    .dialog-background();

    // border-radius: var(--custom-border-radius) !important;
    border: unset;

    >.b3-dialog__close {
        // border-radius: 50%;

        &:hover {
            /* 关闭按钮 */
            // color: var(--b3-theme-surface);
            // background-color: var(--b3-theme-on-surface);
        }
    }

    // 对话框半透明颜色
    >.b3-dialog__header {
        background-color: var(--custom-dialog-background-color);

        +div {
            background-color: var(--custom-dialog-background-color);
            border-radius: inherit;
        }
    }

    // 对话框内容
    .b3-dialog__content {
        background-color: transparent !important;
    }

    // 设置对话框
    .config__panel {

        // 设置对话框侧边栏
        .b3-tab-bar {
            .b3-form__icon {
                /* 设置搜索输入框 */
            }

            .config__tab-hr {
                /* 设置对话框分割线 */
                margin: 8px 0;
            }

            .b3-list-item {
                /* 设置页签项 */
                margin: 8px !important;
            }
        }

        // 设置主面板包裹容器
        .config__tab-wrap {
            background-color: transparent;
        }

        // 设置主面板
        .config__tab-container {
            background-color: transparent;

            // 集市面板
            &[data-name=bazaar] {

                // 集市资源卡片
                .b3-card {
                    background-color: transparent;
                }

                // 集市内容详情对话框
                .config-bazaar__readme {
                    // .dialog-background();
                    background-color: var(--custom-dialog-bazaar-readme-background-color);

                    // 集市详情侧边栏
                    .item__side {
                        border-right: 2px solid var(--b3-border-color);
                    }

                    // 集市详情主体
                    .item__main {}
                }
            }

            // 账号订阅区域
            .config-account__center--text {
                background-color: transparent;
                border-left: 1px solid var(--b3-border-color);
            }
        }
    }

    // 文件历史对话框
    .history__panel {
        .history__text {
            /* 历史对话框内容框 */
            background-color: transparent;
        }
    }

    // 块属性对话框
    .custom-attr {

        // 常规属性
        &[data-type=attr] {
            .b3-label {
                border-bottom: 1px solid var(--b3-border-color);
            }
        }

        // 属性视图属性
        &[data-type=NodeAttributeView] {

            // 属性视图标题
            .custom-attr__avheader {
                &:not(:first-child) {
                    border-top: 2px solid var(--b3-border-color);
                }
            }

            // 属性视图属性
            .block__icons {
                border-bottom: 1px solid var(--b3-border-color);
            }
        }

        // 自定义属性
        &[data-type=custom] {
            .b3-label {
                border-bottom: 1px solid var(--b3-border-color);
            }
        }
    }

    .fn__flex-column {
        border-radius: inherit;

        // 搜索命名查询栏
        #criteria {
            background-color: transparent !important;
            border-bottom: 1px solid var(--b3-theme-surface-lighter);
        }

        // 搜索内容输入框
        .search__header {

            &,
            >input {
                background-color: transparent;
            }
        }

        .layout-tab-bar {
            background-color: transparent;

            .item {
                .item__text {
                    /* 对话框页签 */
                    padding: 0 0.5em;
                }
            }
        }
    }

    .fn__flex {

        >.b3-list {
            >.b3-list-item:not(.b3-list-item--focus) {
                background-color: transparent;
            }
        }

        >.b3-tab-container {

            &,
            .config-account__center--text {
                background-color: transparent;
            }

            .config-bazaar__readme {
                /* 主题预览对话框 */
                background-color: var(--custom-dialog-readme-background-color);
            }

        }
    }

    label.customItem {
        >span.ft__on-surface.fn__flex-center {
            /* 自定义属性名称全宽显示 */
            min-width: 100px;
            width: auto !important;
        }
    }
}

// 搜索提示信息
.search__header {
    .search__path {
        // font-size: 1em;
        height: 16px;

        .search__rmpath {
            /* 搜索路径移除按钮 */
            top: 0;

            background-color: transparent;

            &:hover {
                color: var(--b3-theme-surface);
                background-color: var(--b3-theme-on-surface);
            }
        }
    }
}

// 搜索结果内容显示方式
#searchList,
.search__list {
    >.b3-list-item {
        &[data-type="search-item"] {
            /* 未分组 */
            .search-list-item();
        }

        // 已分组
        &:not([data-type="search-item"]) {
            outline-color: var(--b3-theme-on-surface);

            .b3-list-item__text {
                color: var(--custom-popover-menu-path-color) !important;
            }
        }
    }
}

// 其他列表内容显示方式
.b3-list.b3-list--background {
    >.b3-list-item {
        &[data-type="card-item"] {
            /* 卡包列表 */
            .search-list-item();
        }
    }
}

/* 搜索输入框 */
.search__header,
#searchInput,
#replaceInput,
/* 搜索结果列表 */
#searchList,
/* 搜索结果预览 */
#searchPreview,
/* 资源文件搜索结果预览 */
#searchAssetPreview {
    background-color: transparent;
}

/* 历史容器 */
#historyContainer {
    >* {
        background-color: transparent !important;
    }

    .history__repo {
        .history__repoheader {
            /* 历史控件栏 */
            border-top: 1px solid var(--b3-scroll-color);
            border-bottom: 1px solid var(--b3-scroll-color);
        }

        // 快照面板
        &[data-type=repo] {
            .b3-list {

                // 快照项
                .b3-list-item[data-type=repoitem] {

                    // 快照创建时间
                    [data-type=hCreated] {
                        color: var(--custom-snapshot-created-time-color);
                    }

                    // 快照附加信息
                    .b3-list-item__meta {
                        color: var(--custom-snapshot-additional-info-color);
                        line-height: 1.5em;

                        // 快照文件信息
                        +.b3-list-item__meta {
                            color: var(--custom-snapshot-file-info-color);
                        }
                    }
                }
            }
        }
    }

    .history__asset,
    .history__text {
        /* 历史对话框内容框 */
        // border-left: 2px solid var(--b3-border-color);
        background-color: transparent;
    }
}

// 编辑器内 dialog 容器
#dialogContainer {
    .dialog {
        background-color: var(--custom-editor-background-color);
    }
}

.b3-dialog__scrim {
    /* 对话框遮罩 */
    background-color: var(--custom-scrim-background-color) !important;
}

/* 闪卡显示容器 */
.b3-dialog__cardblock {
    outline: 1px solid var(--b3-scroll-color);
}

/* 搜索控件 */
/* div.b3-dialog__container div.fn__flex-column>div.b3-form__space--small {
    background-color: var(--custom-editor-breadcrumb-bar-background-color);
} */

/** 搜索对话框
 *  REF: [siyuan-themes-tsundoku-dark/ctrlP.css at main · Achuan-2/siyuan-themes-tsundoku-dark](https: //github.com/Achuan-2/siyuan-themes-tsundoku-dark/blob/main/style/ctrlP.css)
 *  REF: [自定义样式：搜索窗口改造（窗口放大+左右布局） - 链滴](https: //ld246.com/article/1648269766832)
 */
/* 搜索对话框尺寸 */
body {
    >.b3-dialog--open:has(#searchInput) {
        >.b3-dialog {
            >.b3-dialog__container {

                // 调整搜索框关闭按钮位置, 避免被遮挡
                >.b3-dialog__close {
                    // right: calc((100vw - var(--custom-dialog-search-width)) / -2);
                }
            }
        }
    }
}

/* 制卡(添加到卡包)对话框 */
.b3-dialog--open[data-key=makeCard] {

    .b3-dialog__container {

        // 卡包列表
        .b3-list.b3-list--background {

            // 卡包
            >.b3-list-item {

                // 卡包信息
                >.b3-list-item__meta {
                    margin-left: 8px;
                    font-size: unset;
                }

                // 按钮控件
                >.b3-list-item__action {
                    height: 24px;
                }
            }
        }
    }
}

/* 闪卡复习对话框 */
.b3-dialog--open:has(.card__block, #cardPreview) {

    .b3-dialog__container {

        // 卡片内容
        .card__block.protyle {
            border-bottom: 2px solid var(--b3-border-color);
        }

        // 无复习内容
        .card__empty {
            background-color: transparent;
        }

        // 按钮栏
        .card__action {
            >div {
                /* 复习按钮容器 */
                text-align: center;

                .b3-button {
                    /* 复习按钮 */
                    padding: 0;
                    display: inline-flex;

                    >div {
                        /* 按钮 emoji */
                        font-size: 1.5em;
                        line-height: 2em;
                        margin: 0;
                    }
                }
            }

            >.b3-button--cancel {
                /* 撤销复习按钮 */
                opacity: unset;
                outline: 1px solid var(--b3-theme-primary);
            }
        }
    }
}


/* 窗口较宽时并排显示搜索结果 */
/* @deprecated: [搜索界面支持左右布局 · Issue #6744 · siyuan-note/siyuan · GitHub](https://github.com/siyuan-note/siyuan/issues/6744) */
// @media screen and (min-width: 960px) {
//     body {
//         >div[data-key] {
//             >.b3-dialog {
//                 >.b3-dialog__container {

//                     .fn__flex-column {
//                         /* 弹性盒子模式: 水平显示, 必要时折行 */
//                         flex-direction: row !important;
//                         flex-wrap: wrap;

//                         .search__header,
//                         .b3-form__space--small {
//                             /* 设置需要占满一行的项目 */
//                             width: 100%;
//                         }

//                         .search__header {
//                             /* 搜索栏 */
//                             border-bottom-color: var(--b3-theme-on-surface-light);
//                         }

//                         #searchList,
//                         #searchPreview {
//                             /* 搜索结果与搜索结果预览分栏 */
//                             float: left;
//                             width: 50% !important;
//                         }

//                         .search__header:first-child {
//                             +.search__header:is(.fn__none) {

//                                 ~#searchList,
//                                 ~#searchPreview {
//                                     height: calc(100% - 92px) !important;
//                                 }
//                             }

//                             +.search__header:not(.fn__none) {

//                                 ~#searchList,
//                                 ~#searchPreview {
//                                     height: calc(100% - 142px) !important;
//                                 }
//                             }
//                         }
//                     }
//                 }
//             }
//         }
//     }
// }
